<template>
  <div class="user_list">
    <group>
    <div class="list_cells">
        <div class="list_cell" v-for="playerapplication in playerapplicationlist" :key="playerapplication.playerid">
          <img :src="playerapplication.figure || 'https://cdn.hbjxqp.happypoker.cn/static/img/avatar.png'" alt="头像">
          <div class="user_text">
            <h4>{{ playerapplication.nickname }}</h4>
            <p>ID:{{ playerapplication.playerid }}</p>
          </div>
          <div class="user_ft">
              <div class="user_box">
                <x-button class="btn_sun" mini @click.native="check(playerapplication.playerid,playerapplication.clubid,1)">确定</x-button>
                <x-button class="btn_cancel" plain mini @click.native="check(playerapplication.playerid,playerapplication.clubid,2)">拒绝</x-button>
              </div>
              <span>（申请加入{{playerapplication.clubname}}亲友圈）</span>
          </div>
        </div>
    </div>
    </group>
    
  </div>
</template>

<script>
import { Group, XButton, Alert } from "vux";
import qs from "qs";
export default {
  data() {
    return {
      playerapplicationlist: [] //获取选中用户容器
    };
  },
  components: {
    XButton,
    Group,
    Alert
  },
  created() {
    //初始化数据
    this.getData();
  },
  methods: {
    getData() {
      this.apiService.club
        .playerapplicationlist().then(res => {
        if (res.code == 0) {
          this.playerapplicationlist = res.data.playerapplicationlist;
        } else {
          this.showPlugin(res.msg);
        }
      });
    },
    check(playerid, clubid, status) {
      this.apiService.club
        .auditplayerapplication({
            playerid: playerid,
            clubid: clubid,
            status: status
          })
        .then(res => {
          if (res.code == 0) {
            this.getData();
            this.showPlugin(res.msg);
          } else {
            this.showPlugin(res.msg);
          }

        });
    },
    showPlugin(msg) {
      this.$vux.alert.show({
        title: this.COMPANY_GAME_NAME,
        content: msg
      });
      setTimeout(() => {
        //提示弹框
        this.$vux.alert.hide();
      }, 3000);
    }
  }
};
</script>

<style scoped>
.list_cells{
  height: 80vh;
  overflow: auto;
}
.user_list .list_cell {
  padding: 10px 15px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.user_list .list_cell img {
  margin-right: 0.8em;
  width: .9rem;
  height: .9rem;
  border-radius: 5px;
}
.user_list .list_cell span {
  color: #999999;
  font-size: 0.25rem;
}
.user_list .user_text {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  flex: 1;
}
.user_list .user_text h4 {
  font-size: 0.3rem;
  font-weight: 600;
}
.user_list .user_text p {
  color: rgb(85, 85, 85);
  font-size: 0.26rem;
  margin-top: 0.15rem;
}
.user_list .list_cell:before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  height: 1px;
  border-top: 1px solid #d9d9d9;
  color: #d9d9d9;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-transform: scaleY(0.5);
  transform: scaleY(0.5);
}
.user_box {
  color: #000;
  text-align: right;
  padding: 0 15px;
}
.user_box .btn_sun {
  color: #fff;
  background-color: #1aad19;
}
.user_box .btn_cancel {
  border: 1px solid #d9d9d9;
}
</style>

